<template>
	<view v-if="tableInfo">
		<u-modal @confirm="$Go('/pages/my/charge?id='+id)" v-model="showTags" :content="'目前消费￥'+changePrice+',选择充值更加优惠~' " show-cancel-button confirm-text="去充值"></u-modal>
		
		
		<view style="background: linear-gradient(180deg,#fff3eb, #fffbf9 100%)00%);height:300rpx;text-align: center;">
			<view style=";padding-top: 30rpx;">
				<u-count-to duration='1000'  bold :end-val="changePrice" :decimals="2" :font-size='80' color='#4F8BFF' v-if="changePrice"></u-count-to>
			</view>
			<view class="u-margin-top-20">请支付本次台费哦~</view>
		</view>
		
		<view class="" style="padding: 40rpx 0;">
			<view class="" style="padding:0 20rpx;">
				<u-section title="明细" :right='false'></u-section>
			</view>
			
			<view style="padding:20rpx 40rpx;">
				<u-cell-item  title="开台时间" :arrow="false" :value='tableInfo.updateTime'></u-cell-item>
				<u-cell-item  title="时长" :arrow="false" :value='tableInfo.orders.minute'></u-cell-item>
				<u-cell-item  title="单价" :arrow="false" :value=" `￥${tableInfo.basePrice}/${tableInfo.baseTime}分钟   超出￥${tableInfo.overPrice}`"></u-cell-item>
				<u-cell-item  title="总价" :arrow="false"  :value="`￥${changePrice}`"></u-cell-item>
			    <view style="color: #4F8BFF;margin: 20rpx 20rpx;">温馨提示：结账后押金自动退回支付账户！</view>
			</view>
			
			
			<view class="" style="padding:0 20rpx;">
				<u-section title="支付优惠" :right='false'></u-section>
			</view>
			<view style="padding:20rpx 40rpx;">
				<u-cell-item  title="优惠券"  @click='openCounpond'  :value='`${Counpond.money}`'></u-cell-item>
				
			</view>
			
			<view
			@click="ok"
				style="
				width: 700rpx;
				margin: auto;
			background: linear-gradient(180deg,#4f8bff , #745eff );
			border-radius: 58px;
			box-shadow: 0px 6px 12px 0px rgba(2,88,255,0.28);padding: 30rpx;margin-top: 20rpx;text-align: center;color: #fff;margin-top: 40rpx;">
				立即支付
			</view>
		</view>
		
		<u-popup v-model="show" mode="bottom"  border-radius="30">
				<view style="background: #fff;">
					<coupond :list='list'  @selectConpound='selectConpound' v-if="list.length"></coupond>
				</view>	
		</u-popup>
		
		
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import wxpay from '@/common/wxpay.js'
	import coupond from './components/coupond.vue'
	export default{
		components:{
			coupond
		},
		
		data(){
			return{
				showTags:false,
				tableInfo:{},
				list:[],
				 show:false,
				 Counpond:{
					 money:'',
					 id:''
				 },
				 id:''
			}
		},
		computed:{
		    changePrice(){
				if(this.tableInfo.orders){
					let money=this.tableInfo.orders.money;
					let CounpondMoney=this.Counpond.money;
					return (Number(money-CounpondMoney)>0?Number(money-CounpondMoney):0).toFixed(2);
				}
			}
		},
		async onLoad(options){
			
			if(options.id){
				this.id=options.id;
				await this.detail({id:options.id})
				this.getCoupond()
				
				
				// this.showTags=true
			}
		},
		methods:{
			selectConpound(e){
				
				this.show=false;
				this.Counpond=e;
			
			},
			getCoupond(){
				this.$u.post('/user/coupon', {
					limit:100,
					status:2,
					money:this.tableInfo.orders.money,
					com_id:this.tableInfo.comId,
				}).then(res => {
					this.list=res;
				})
			},
			openCounpond(){
				if(this.list.length){
					this.show=true
				}else{
					this.$u.toast('暂无优惠券')
				}
				
			},
			detail(item) {
				return new Promise((resolve,reject)=>{
					this.$u.post('/index/carportDetail', {
						id: item.id,
					}).then(res => {
						this.tableInfo=res;
						resolve(res)
					})
				})
				
			},
			ok(){
				this.$u.post('/indent/orderFinish', {
					order_id: this.tableInfo.orders.orderId,
					member_coupon_id:this.Counpond.id
				}).then(res => {
					if(Array.isArray(res)){
						this.$refs.uToast.show({
							title: '付款成功',
							type: 'success',
							callback: () => {
								uni.redirectTo({
									url:'/pages/my/bookList'
								})
								
							}
						
						})
					}else{
						const wx = new wxpay(res);
						wx.pay().then(res => {
							this.$refs.uToast.show({
								title: '付款成功',
								type: 'success',
								callback: () => {
									uni.redirectTo({
										url:'/pages/my/bookList'
									})
									
								}
							})
						}).catch(err => {
						
						})
					}
					
					
					
				}).catch(err=>{
					console.log(err)
					if(err.data.code==500){
						this.$refs.uToast.show({
							title: '付款成功',
							type: 'success',
							callback: () => {
								uni.navigateBack()
							}
						})
					}
				})
			}
		}
	}
</script>

<style>
	
</style>